<script>
    import Card from "../base/Card.svelte";
    import resources_dispatch from "/src/libs/scripts/resource/dispatch.js"

    let resources = resources_dispatch

    export let resource
</script>

<main>
    <Card>
        <div class="row-card">
            <img src={`/src/libs/images/resource/${resource}.png`} alt="" class="re-img">
            <div class="infor">
                {resources[resource].info}
            </div>
        </div>
        <div slot="badge" class="badge-resource">
              资源:{resources[resource].name}
        </div>
    </Card>
</main>

<style lang="less">
    .body{
      //width: 140px;
      //height:80px;
    }
    .infor{
      font-size: 13px;
      margin-top: 15px;
      text-align: left;
      width: 43%;
      display: flex;
      //justify-content: center;
      align-items: center;
    }
    .re-img{
      width: 30%;
      display: block;
    }
</style>